<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<title>设置权限</title>
<%@include file="/WEB-INF/jsp/public/commons.jspf"%>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/jquery_treeview/jquery.treeview.css">
<script src="${pageContext.request.contextPath }/jquery_treeview/jquery.treeview.js"></script>
   <script type="text/javascript">
        $(function(){
            // 指定事件处理函数
            $("[name=privilegeIds]").click(function(){

                // 当选中或取消一个权限时，也同时选中或取消所有的下级权限
                $(this).siblings("ul").find("input").prop("checked", this.checked);//attr("checked", this.checked);

                // 当选中一个权限时，也要选中所有的直接上级权限
                if(this.checked == true){
                    $(this).parents("li").children("input").prop("checked", true);//.attr("checked", true);
                }

            });

            //添加树的插件
            $("#tree").treeview();
        });
    </script>
</head>
<body>
<ol class="breadcrumb">
  <li><a href="home_innerCentre.action">首页</a></li>
  <li><a href="role_list.action">角色管理</a></li>
  <li class="active">设置权限</li>
</ol>

<div class="container well well-sm">
	<div class="row">
		<div class="col-sm-6 col-sm-offset-3">

	<!-- 标题显示 -->
     <h5> 正在为【${name}】配置权限 </h5>
		<!--显示表单内容-->
		<div id=MainArea>
		    <s:form action="role_setPrivilege">
		        <s:hidden name="id"></s:hidden>
		
		        <!-- 表单内容显示 -->
		        <div>
		            <div>
		                <table>
		                    <!--表头-->
		                    <thead>
		                    <tr align="LEFT" valign="MIDDLE" id="TableTitle">
		                        <td width="300px" style="padding-left: 7px;">
		                            <!-- 如果把全选元素的id指定为selectAll，并且有函数selectAll()，就会有错。因为有一种用法：可以直接用id引用元素 -->
		                            <input type="CHECKBOX" id="cbSelectAll"
		                                   onClick="$('[name=privilegeIds]').attr('checked',this.checked)"/>
		                            <label for="cbSelectAll">全选</label>
		                        </td>
		                    </tr>
		                    </thead>
		
		                    <!--显示数据列表-->
		                    <tbody id="TableData">
		                    <tr>
		                        <!-- 显示权限树 -->
		                        <td>
		                            <ul id="tree">
		                                <s:iterator value="#application.topPrivilegeList">
		                                    <li>
		                                        <input type="checkbox" name="privilegeIds" value="${id}" id="cb_${id}" <s:property value="%{id in privilegeIds ? 'checked' : ''}"/> />
		                                        <label for="cb_${id}"><span class="folder">${name}</span></label>
		                                        <ul>
		                                            <s:iterator value="children">
		                                                <li>
		                                                    <input type="checkbox" name="privilegeIds" value="${id}" id="cb_${id}" <s:property value="%{id in privilegeIds ? 'checked' : ''}"/> />
		                                                    <label for="cb_${id}"><span class="folder">${name}</span></label>
		                                                    <ul>
		                                                        <s:iterator value="children">
		                                                            <li>
		                                                                <input type="checkbox" name="privilegeIds" value="${id}" id="cb_${id}" <s:property value="%{id in privilegeIds ? 'checked' : ''}"/> />
		                                                                <label for="cb_${id}"><span class="folder">${name}</span></label>
		                                                            </li>
		                                                        </s:iterator>
		                                                    </ul>
		                                                </li>
		                                            </s:iterator>
		                                        </ul>
		                                    </li>
		                                </s:iterator>
		                            </ul>
		                        </td>
		                    </tr>
		                    </tbody>
		                </table>
		            </div>
		        </div>
		</div>
		</div>
		    	</div>
	</div>
    <!-- 表单操作 -->
	   	<div class="form-group text-center" >
	   		<div class="col-sm-2 col-sm-offset-3">
				 <a href="javascript:history.go(-1);" class="btn btn-info">返回</a>
			 </div>
			 <div class="col-sm-2 col-sm-offset-1">
				<button type="submit" class="btn btn-success">保存</button>
			 </div>
	   </div>
    </s:form>
</body>
</html>